<template>
    <div class="container">
    <div class="item">
      <img src="../assets_community/每日理财课堂.svg" alt="每日理财讲堂" />
    </div>
    <div class="item">
      <img src="../assets_community/理财小助手.svg" alt="理财小助手" />
    </div>
    <div class="item">
      <img src="../assets_community/金融服务.svg" alt="金融服务" />
    </div>
    <div class="item">
      <img src="../assets_community/复旦金融精品课.svg" alt="复旦金融精品课" />
    </div>
    <div class="item">
      <img src="../assets_community/反诈.svg" alt="反诈" />
    </div>
    <div class="item">
      <img src="../assets_community/金融产品.svg" alt="金融产品" />
    </div>
  </div>
  
</template>

<script>
export default {
  name: "encyclopedia",
};
</script>

<style scoped>

/* .encyclopedia {
  margin: 0;
  padding: 10px;
} */
.container {
  column-count: 2; /* 两列布局 */
  column-gap: 0;
  width: auto;
}

.item {
  /* background-color: #eee; */
  /* margin-bottom: 1rem; */
  /* padding: 1rem; */
  break-inside: avoid;
  /* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); */
  border-radius: 5px;
}

.item img {
  max-width: 100%;
  height: auto;
  display: block;
  /* margin-bottom: 0.5rem; */
  border-radius: 5px;
}
</style>
